<template>
  <div class="myorder">
    <el-table
      v-loading="loading"
      :data="tableData"
      border
      style="font-size: 20px"
      empty-text="暂无订单"
    >
      <el-table-column prop="description" label="交易项目" :resizable="false"></el-table-column>
      <el-table-column prop="orderMoney" label="金额" width="180" :resizable="false"></el-table-column>
      <el-table-column prop="createTime" label="付款时间" width="220"></el-table-column>
    </el-table>
    <div class="pageList">
      <paging ref="paging_zi" @CurrentPage="accept_CurrentValue" />
    </div>
  </div>
</template>

<script>
import paging from "../../../components/paging.vue";
import { commonRequest } from "../../../api/api.js";
export default {
  name: "order",
  components: {
    paging
  },
  data() {
    return {
      tableData: [],
      page: 1,
      loading: true
    };
  },
  mounted() {
    this.DataQq();
  },
  methods: {
    accept_CurrentValue(value) {
      this.page = value;
      this.DataQq();
    },
    DataQq() {
      this.loading = true;
      commonRequest("/api/ums/umsUsers/getMyOrderInfo", {
        pageNo: this.page
      }).then(res => {
        for (let i = 0; i < res.records.length; i++) {
          res.records[i].orderMoney = Number(res.records[i].orderMoney) / 100;
        }
        this.loading = false;
        this.tableData = res.records;
        this.$refs.paging_zi.totalValue(res.total);
      });
    }
  }
};
</script>

<style lang="less" scoped>
/deep/ .el-table__header-wrapper {
  font-size: 14px;
}
/deep/ .el-table__body-wrapper {
  font-size: 14px;
}
.myorder {
  width: 900px;
  .pageList {
    height: 100px;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
  }
}
</style>
